<html
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">

    <ui:composition template="layout.xhtml">
        
        <ui:define name="title">
            Distribuição
        </ui:define>

        <ui:define name="breadcrumb">
            <div class="breadcrumb_divider"></div>
            <a href="pesquisarDistribuicao.xhtml">Distribuição</a>
            <div class="breadcrumb_divider"></div>
            <a class="current">#{ managerCriarDistribuicao.distribuicao.id == null ? 'Cadastrar' : 'Editar' }</a>
        </ui:define>

        <ui:define name="sidebar">
            <h3>Distribuição</h3>
            <ul class="toggle">
                <li class="icn_new_article"><a href="criarDistribuicao.xhtml">Cadastrar</a></li>
                <li class="icn_search"><a href="pesquisarDistribuicao.xhtml">Pesquisar</a></li>
            </ul>
            <h3>Ações</h3>
            <ul class="toggle">
                <li class="icn_categories"><a href="criarDistribuicao.xhtml?distribuicaoId=#{ managerCriarDistribuicao.distribuicao.id }">Visualizar</a></li>
            </ul>
        </ui:define>        
        
        <ui:define name="content">               

            <p:panel id="pesquisarDistribuicaoPanel" styleClass="column12">
                <div class="row">
                    <div class="column2 bold">
                        <p:outputLabel value="Recebedor:" />
                    </div>
                    <div class="column10 text">
                        <p:outputLabel value="#{ managerPesquisarDistribuicao.distribuicaoVisualizar.recebedor.nome }" />
                    </div>
                </div>

                <div class="row">
                    <div class="column2 bold">
                        <p:outputLabel value="Comentário:" />
                    </div>
                    <div class="column10 text">
                        <p:outputLabel value="#{ managerPesquisarDistribuicao.distribuicaoVisualizar.comentario }" />
                    </div>
                </div>

                <p:dataTable id="detalheEntradaSeloDataTable" var="distribuicao" value="#{ managerPesquisarDistribuicao.distribuicaoItens }"
                        styleClass="grid_24" emptyMessage="Nenhum item adicionado">
                    <f:facet name="header">Itens da distribuição</f:facet>

                    <p:column headerText="Tipo de Selo">
                        <h:outputText value="#{ distribuicao.tipoSelo.nome }" />
                    </p:column>
                    <p:column headerText="Cor do Selo">
                        <div class="color" style="background: \##{ distribuicao.tipoSelo.corSelo }"></div>
                    </p:column>
                    <p:column headerText="Quantidade">
                        <h:outputText value="#{ distribuicao.quantidade }" />
                    </p:column>                            
                </p:dataTable>            
            </p:panel>

            <div class="command">
                <p:button value="Voltar" icon="ui-icon-arrowreturn-1-w" href="pesquisarDistribuicao.xhtml" />
            </div>

        </ui:define>
    </ui:composition>
    
</html>